<template>
  <Dialog v-model="show" :title="t('goods_list.查看规格')" width="1000" :hide-footer="true">
    <el-table :data="specDataList" border class="mt12 cover-table">
      <el-table-column :label="t('goods_list.序号')" type="index" width="80" />
      <el-table-column
        v-for="(item, index) in specList.filter((v) => v.info.length > 0)"
        :key="item.value"
        :label="item['label' + locale]"
      >
        <template #default="{ row }">
          {{ row[`spec_${item.value}`]?.["name" + locale] || "-" }}
        </template>
      </el-table-column>
      <el-table-column :label="t('goods_list.原价')" prop="originalPrice"/>
      <el-table-column :label="t('goods_list.价格')" prop="price"/>
      <el-table-column :label="t('goods_list.库存')" prop="stock"/>
      <el-table-column :label="t('goods_list.货号')" prop="itemCode" width="120"/>
      <el-table-column :label="t('goods_list.默认选中')" width="100">
        <template #default="{ row }">
          <el-radio v-model="flag" :value="row.id" disabled/>
        </template>
      </el-table-column>
    </el-table>
  </Dialog>
</template>

<script setup>
import { ref, watch, defineProps, defineEmits, computed, onUnmounted } from "vue";
import Dialog from "@/components/dialog.vue";
import { specList, specDataList, initDetailData, flag, rest } from "../releaseStore2";
import { useI18n } from "vue-i18n";

const { t, locale } = useI18n();

const show = defineModel();
const props = defineProps({
  data: {
    type: Object,
    default: () => {},
  },
});

watch(
  () => show.value,
  (newVal) => {
    if (newVal) {
      initDetailData(props.data.id);
    }
  },
  { deep: true }
);

onUnmounted(()=>{
  rest()
})
</script>
